<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        /*  快级标签  */
        #div1 {
            /*高*/
            height: 400px;
            /*宽*/
            width: 400px;
            /*背景颜色*/
            background-color: blueviolet;
            /*  变框  */
            border: 10px solid palevioletred;    /*  solid实线 */
            border-top: 10px dotted green;          /*  dotted点线 */
            border-left: 10px dashed burlywood;         /*  dashed虚线 */
            border-right: 10px double paleturquoise;        /*  double双实线 */

            /*  外边距 */
            margin: 20px;
            /*  内边距  */
            padding: 40px;
        }
        /* 通配符选择器 */
        /** {*/
        /*    !*内边距*!*/
        /*    padding: 0;*/
        /*    !*外边距*!*/
        /*    margin: 0;*/
        /*}*/
        /* 鼠标移入的效果 */
        /*#div1:hover{*/
        /*    background-color: yellow;*/
        /*}*/
    </style>
</head>
<body>
    <div id="div1">
        我是XXX
    </div>
</body>
</html>